<template>
	<div>
		<div v-if="chenload">
			<div id="dataList0" v-if="recordall.length!=0||recordall.length!='0'">
				<div v-if="record.length!=0||record.length!='0'">
					<div class="buycon" v-for="(item,index) in record">
						<div class="every">
							<div class="everytop">
								<div class="topleft">{{item.name}}</div>
								<div class="topright wx" v-if="item.from==1||item.from=='1'||item.from==2||item.from=='2'">微信支付</div>
								<div class="topright wx" v-if="item.from==4||item.from=='4'">apple pay</div>
								<div class="topright self" v-if="item.from==3||item.from=='3'">小七币支付</div>
							</div>
							<div class="everybottom">
								<div class="bottomleft">{{item.pay_time}}</div>
								<div class="bottomright">消费: ¥{{item.price}}</div>
							</div>
						</div>
					</div>
				</div>
				<div v-if="recordVip.length!=0||recordVip.length!='0'">
					<div class="buycon" v-for="(item,index) in recordVip">
						<div class="every">
							<div class="everytop">
								<div class="topleft" v-if="item.subject==99||item.subject=='99'">白金VIP（三科永久会员）</div>
								<div class="topleft" v-if="item.subject==1||item.subject=='1'">普通VIP（口腔执业助理医师）</div>
								<div class="topleft" v-if="item.subject==2||item.subject=='2'">普通VIP（口腔执业医师）</div>
								<div class="topleft" v-if="item.subject==3||item.subject=='3'">普通VIP（口腔中级医师）</div>
								<div class="topright wx" v-if="item.from==1||item.from=='1'||item.from==2||item.from=='2'">微信支付</div>
								<div class="topright wx" v-if="item.from==4||item.from=='4'">apple pay</div>
								<div class="topright self" v-if="item.from==3||item.from=='3'">小七币支付</div>
							</div>
							<div class="everybottom">
								<div class="bottomleft">{{item.pay_time}}</div>
								<div class="bottomright">消费: ¥{{item.price}}</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div v-else class="chen-kongpicbuy">
				<div class="chen-kongpic">
					<img src="../../../../src/assets/img/nobuyrecord.png" mode=""></img>
				</div>
				<div class="chen-kong-text"><span>暂时未有购买记录</span></div>
			</div>
		</div>
		<div class="loadmore" v-else>
			<img src="../../../../src/assets/img/load.gif" alt="">
		</div>
	</div>
</template>

<script>
	export default { 
		data() {
			return {
				chenload:false,
				recordall:[],
				record:[],
				recordVip:[],
			};
		},
		methods: {
			orderLog(){
				var that = this;
				that.axios.get(that.$store.state.url +'MyTk/orderLog').then(res=>{
					if(res.data.errcode==0||res.data.errcode=='0'){  
						// console.log(res.data);
						var data = res.data.data.test_order;
						var data1 = res.data.data.vip_order;
						that.recordVip = data1;
						that.record = data;
						that.recordall=data.concat(data1);
						// console.log(that.record);    
					}
					that.chenload = true;
				
				})
			}
		},
		mounted(){
			var that = this;
			if (that.$route.query.token) {
				that.axios.defaults.headers.common['token'] = that.$route.query.token;
			}
			that.orderLog();
			
		}
	}
</script>

<style scoped="scoped">
.buycon{
	width: 6.9rem;
	margin: auto;
}
.every .everytop{
	padding-top: .32rem;
	display: flex;
	justify-content: space-between;
}
.topleft{
	width: 4.9rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: .3rem;
	color: #333333;
}
.topright{
	/* width: 1.2rem; */
	padding: .05rem .1rem;
	/* height: .32rem; */
	/* line-height: .32rem; */
	font-size: .24rem;
	color: #fff;
	text-align: center;
	border-radius: .16rem;
}
.wx{
	background: #58BC46;
}
.self{
	background: #0287FF;
}
.everybottom{
	padding: .32rem 0;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #ededed;
}
.bottomleft{
	color: #999999;
	font-size: .26rem;
}
.bottomright{
	color: #333333;
	font-size: .26rem;
}
</style>
